import React, {Component} from 'react'
import {BrowserRouter , NavLink, Route} from 'react-router-dom'



import HeaderView from './views/headerView.js'
import SidebarView from './views/sidebarView.js'

import Home from './pages/home.js'
import Film from './pages/film.js'
import Cinema from './pages/cinema.js'
import Shop from './pages/shop.js'
import Me from './pages/me.js'
import Card from './pages/card.js'

export default class App extends Component{
	constructor(){
		super();
		this.state = {
			showSidebar: false,
			headerTitle: '卖座电影'
		}
	}
	render(){
		
		return(
			<BrowserRouter>
				<div>
					
					<HeaderView title={this.state.headerTitle} showMenu={this.showMenu.bind(this)}/>
					
					<Route path="/" render={({history, location})=>{
						return <SidebarView history={history} 
									      show={this.state.showSidebar}
									      pathname={location.pathname}
									      hideHandle={this.showMenu.bind(this)}/>
					}}/>
					
					<Route path="/" exact component={Home}/>
					<Route path="/film" component={Film}/>
					<Route path="/cinema" component={Cinema}/>
					<Route path="/shop" component={Shop}/>
					<Route path="/me" component={Me}/>
					<Route path="/card" component={Card}/>
					
				</div>
			</BrowserRouter>
		)
	}
	showMenu(headerTitle){//控制侧边栏显示
		//console.log('点击了菜单栏');
		//console.log(this.state.showSidebar);
		this.setState({showSidebar: !this.state.showSidebar});
		//console.log(this.state.showSidebar);
		//console.log(history);
		//console.log(location);
		if(headerTitle){
			this.setState({headerTitle});
		}
	}
}
